<template>
  <div>
    <el-form style="width: 420px;margin: auto" :model="shippingOrderForm" :rules="rules" ref="shippingOrderForm"
             label-width="100px" class="demo-ruleForm" >
      <!--    <el-form-item label="编号">-->
      <!--      <el-input v-model="shippingOrderForm.creatorId" readOnly></el-input>-->
      <!--    </el-form-item>-->
      <el-form-item label="收货人" prop="cosignee">
        <el-input v-model="shippingOrderForm.cosignee" placeholder="请输入收货人"></el-input>
      </el-form-item>
      <el-form-item label="发货地" prop="start">
        <el-input v-model="shippingOrderForm.start" placeholder="请输入发货地"></el-input>
      </el-form-item>
      <el-form-item label="目的地" prop="target">
        <el-input v-model="shippingOrderForm.target" placeholder="请输入目的地"></el-input>
      </el-form-item>
      <el-form-item label="距离" prop="distance">
        <el-input v-model="shippingOrderForm.distance" placeholder="请输入距离（km）"></el-input>
      </el-form-item>
      <el-form-item label="货物名称" prop="goods">
        <el-input v-model="shippingOrderForm.goods" type="textarea" :autosize="{ minRows: 3}" placeholder="请输入货物内容(货物名+重量t）"></el-input>
      </el-form-item>
      <el-form-item label="总重量" prop="weight">
        <el-input v-model="shippingOrderForm.weight" placeholder="请输入总重量（t）"></el-input>
      </el-form-item>
      <el-form-item label="备注" prop="desc">
        <el-input v-model="shippingOrderForm.desc" type="textarea" :autosize="{ minRows: 3}" placeholder="请输入备注"></el-input>
      </el-form-item>
      <el-form-item>
        <el-button type="primary" @click="submitForm('shippingOrderForm')">创建货运单</el-button>
        <el-button @click="resetForm('shippingOrderForm')">重置</el-button>
      </el-form-item>
    </el-form>
  </div>
</template>

<script>
import {CreateOrder} from "@/api/account";
// import Cookies from "ant-design-vue/dist/antd";
export default {
  name: "createShippingOrder",
  data(){
    return {
      // userInfo:Cookies.get('info'),
      shippingOrderForm: {
        // creatorId: 0,
        cosignee: '',
        target: '',
        start: '',
        goods: '',
        distance: 0,
        weight: 0,
        desc: '',
      },
      rules: {
        // creatorId: [
        //   { required: true, message: '不能为空', trigger: 'blur' }
        // ],
        cosignee: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ],
        target: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ],
        start: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ],
        goods: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ],
        distance: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ],
        weight: [
          { required: true, message: '不能为空', trigger: 'blur' }
        ],
        // desc: [
        //   { required: true, message: '不能为空', trigger: 'blur' }
        // ],
      }
    }
  },

  methods:{
    submitForm(){
      console.log(this.$store.state.details,JSON.parse(localStorage.getItem("user")),123)
      let data={
        // token:this.token,
        creatorId:JSON.parse(localStorage.getItem("user")).id,
        ...this.shippingOrderForm

      }
      CreateOrder(data).then((res) => {
        this.$message.success("创建成功")
        this.$router.push("/shippingOrderList")
      })
    },
    resetForm(formName) {
      this.$refs[formName].resetFields();
    }
  }
}

</script>

<style scoped>

</style>
